<template>
	
	<div>
		
		 <el-table
		    :data="tableData.filter(data => !search || data.name.toLowerCase().includes(search.toLowerCase()))"
		    style="width: 100%">
		    <!-- <el-table-column
		      label="索引"
		      prop="date">
		    </el-table-column> -->
			
			<el-table-column
			 label="索引号"
			  type="index"
			  width="100" align="left">
			</el-table-column>
			
		    <el-table-column
		      label="车位号"
		      prop="name">
		    </el-table-column>
			<el-table-column
			  label="车位区域"
			  prop="name">
			</el-table-column>
			<el-table-column
			  label="车位状态"
			  prop="name">
			</el-table-column>
			<el-table-column
			  label="小时价格"
			  prop="name">
			</el-table-column>
			
			
			
		    <el-table-column
		      align="right">
			  
			  
		      <!-- <template slot="header" slot-scope="scope">
		        <el-input
		          v-model="search"
		          size="mini"
		          placeholder="输入关键字搜索"/>
		      </template> -->
			  
			  
			  <template slot="header" slot-scope="scope">
			    <el-dropdown>
			      <el-button type="primary">
			        那个小区<i class="el-icon-arrow-down el-icon--right"></i>
			      </el-button>
			      <el-dropdown-menu slot="dropdown">
			        <el-dropdown-item>A区</el-dropdown-item>
			        <el-dropdown-item>B区</el-dropdown-item>
			        <el-dropdown-item>C区</el-dropdown-item>
			        <el-dropdown-item>E区</el-dropdown-item>
			      </el-dropdown-menu>
			    </el-dropdown>
			  </template>
			  
			  
		      <template slot-scope="scope">
		        <!-- <el-button
		          size="mini"
		          @click="handleEdit(scope.$index, scope.row)">Edit</el-button> -->
				  
				  
				  
		        <!-- <el-button
		          size="mini"
		          type="danger"
		          @click="handleDelete(scope.$index, scope.row)">Delete</el-button> -->
				  
				  <el-button plain>朴素按钮</el-button>
				  
		      </template>
		    </el-table-column>
		  </el-table>
		
	</div>
	
</template>
 
<script>
	
	 export default {
	    data() {
	      return {
	        tableData: [{
	          date: '2016-05-02',
	          name: '王小虎',
	          address: '上海市普陀区金沙江路 1518 弄'
	        }, {
	          date: '2016-05-04',
	          name: '王小虎',
	          address: '上海市普陀区金沙江路 1517 弄'
	        }, {
	          date: '2016-05-01',
	          name: '王小虎',
	          address: '上海市普陀区金沙江路 1519 弄'
	        }, {
	          date: '2016-05-03',
	          name: '王小虎',
	          address: '上海市普陀区金沙江路 1516 弄'
	        }],
	        search: ''
	      }
	    },
	    methods: {
	      handleEdit(index, row) {
	        console.log(index, row);
	      },
	      handleDelete(index, row) {
	        console.log(index, row);
	      }
	    },
	  }
	
</script>